{% extends "base.html" %}
{% block header %}编辑定时任务{% endblock %}
{% block content %}
<div class="container">
    <h2>编辑定时任务</h2>
    <form method="post">
        {% csrf_token %}
        <div class="row">
            <div class="">
                <label>任务名称</label>
                <input type="text" name="name" class="form-control" value="{{ task.name }}" required>
            </div>
            <div class="">
                <label>任务类型</label>
                <select name="task" class="form-control" required>
                    {% for t in allowed_tasks %}
                    <option value="{{ t.value }}" {% if t.value == task.task %}selected{% endif %}>{{ t.label }}</option>
                    {% endfor %}
                </select>
            </div>
            <div class="">
                <label>定时周期</label>
                <select id="cycle_select" class="form-control" onchange="updateCrontabOptions()">
                    <option value="minute">每分钟</option>
                    <option value="hour">每小时</option>
                    <option value="day">每天</option>
                    <option value="week">每周</option>
                    <option value="month">每月</option>
                </select>
            </div>
            <div class="">
                <label id="option_label">执行时间</label>
                <select id="option_select" class="form-control" onchange="generateCrontab()"></select>
            </div>
            <input type="hidden" id="crontab_input" name="crontab" required>
            <div class="">
                <label>备注</label>
                <input type="text" name="remark" class="form-control" value="{{ task.remark }}">
            </div>
            <div class="">
                <label>是否启用</label>
                <select name="enabled" class="form-control">
                    <option value="True" {% if task.enabled %}selected{% endif %}>启用</option>
                    <option value="False" {% if not task.enabled %}selected{% endif %}>停用</option>
                </select>
            </div>
        </div>
        <button type="submit" class="btn btn-success">保存</button>
        <a href="/tasks/" class="btn btn-secondary ms-2">取消</a>
    </form>
</div>
<script>
function updateCrontabOptions() {
    var cycle = document.getElementById('cycle_select').value;
    var optionSelect = document.getElementById('option_select');
    var label = document.getElementById('option_label');
    optionSelect.innerHTML = '';
    if (cycle === 'minute') {
        label.innerText = '每分钟';
        optionSelect.innerHTML = '<option value="0">每分钟0秒执行</option>';
    } else if (cycle === 'hour') {
        label.innerText = '选择分钟';
        for (var i = 0; i < 60; i++) {
            optionSelect.innerHTML += `<option value="${i}">${i}分</option>`;
        }
    } else if (cycle === 'day') {
        label.innerText = '选择小时和分钟';
        for (var h = 0; h < 24; h++) {
            for (var m = 0; m < 60; m+=5) {
                optionSelect.innerHTML += `<option value="${h}:${m}">${h}点${m}分</option>`;
            }
        }
    } else if (cycle === 'week') {
        label.innerText = '选择星期几和时间';
        var weekDays = ['周日','周一','周二','周三','周四','周五','周六'];
        for (var d = 0; d < 7; d++) {
            for (var h = 0; h < 24; h+=2) {
                for (var m = 0; m < 60; m+=15) {
                    optionSelect.innerHTML += `<option value="${d}:${h}:${m}">${weekDays[d]} ${h}点${m}分</option>`;
                }
            }
        }
    } else if (cycle === 'month') {
        label.innerText = '选择日期和时间';
        for (var date = 1; date <= 28; date++) {
            for (var h = 0; h < 24; h+=2) {
                for (var m = 0; m < 60; m+=15) {
                    optionSelect.innerHTML += `<option value="${date}:${h}:${m}">${date}号 ${h}点${m}分</option>`;
                }
            }
        }
    }
    generateCrontab();
}
function generateCrontab() {
    var cycle = document.getElementById('cycle_select').value;
    var option = document.getElementById('option_select').value;
    var crontab = '';
    if (cycle === 'minute') {
        crontab = '0 * * * *';
    } else if (cycle === 'hour') {
        crontab = option + ' * * * *';
    } else if (cycle === 'day') {
        var arr = option.split(':');
        crontab = arr[1] + ' ' + arr[0] + ' * * *';
    } else if (cycle === 'week') {
        var arr = option.split(':');
        crontab = arr[2] + ' ' + arr[1] + ' * * ' + arr[0];
    } else if (cycle === 'month') {
        var arr = option.split(':');
        crontab = arr[2] + ' ' + arr[1] + ' ' + arr[0] + ' * *';
    }
    document.getElementById('crontab_input').value = crontab;
}
document.addEventListener('DOMContentLoaded', function() {
    updateCrontabOptions();
    document.getElementById('cycle_select').addEventListener('change', updateCrontabOptions);
    document.getElementById('option_select').addEventListener('change', generateCrontab);
});
</script>
{% endblock %}
